<template>
  <div style="background-color:#f0f3f4;width: 100%;height: 100%;margin:0;padding: 0">

    <div class="module" style="float: left;margin-left: 3%">
      <div class="module-title"><span style="color: #757575;font-size: 20px;margin-left: 5%">运单统计</span></div>
      <!--      <div id="module1" class="echarts">-->
      <FreightBillStatistics></FreightBillStatistics>
      <!--      </div>-->
    </div>
    <div class="modulet" style="float: right;margin-right: 3%">
      <div style="width: 100%;height:5%;border-bottom: solid 1px #e0e0e0;text-align: left;line-height: 320%"><span style="color: #757575;font-size: 20px;margin-left: 5%">异常占比统计</span></div>
      <AbnormalStatistics></AbnormalStatistics>
    </div>

    <div class="module" style="float: left;margin-left: 3%">
      <div class="module-title"><span style="color: #757575;font-size: 20px;margin-left: 5%">延误统计</span></div>
      <DelayStatistics></DelayStatistics>
    </div>

    <div class="module" style="float: left;margin-left: 3%;width: 94%;height: 80%">
      <div class="module-title"><span style="color: #757575;font-size: 20px;margin-left: 5%;font-weight: 700">车辆维修保养统计</span></div>
      <VehicleRepaireStatistics></VehicleRepaireStatistics>
    </div>
  </div>
</template>

<script>
import VehicleRepaireStatistics from "./VehicleRepaireStatistics";
import DelayStatistics from "./DelayStatistics";
import AbnormalStatistics from "./AbnormalStatistics";
import FreightBillStatistics from "./FreightBillStatistics ";
export default {
  name: "DispatchingStatistics",
  components:{
    'DelayStatistics':DelayStatistics,
    'FreightBillStatistics':FreightBillStatistics,
    'AbnormalStatistics':AbnormalStatistics,
    'VehicleRepaireStatistics':VehicleRepaireStatistics
  }
}
</script>
<style scoped>
*{
  margin: 0px;
  padding:0;
}
.module{width:45%;height: 60%;background-color: #ffffff;box-shadow: 10px 10px 5px #c4c6c7;border-radius: 5px;margin-top:2%}
.modulet{width:47%;height: 125%;background-color: #ffffff;box-shadow: 10px 10px 5px #c4c6c7;border-radius: 5px;margin-top:2%}
.module-title{width: 100%;height: 10%;border-bottom: solid 1px #e0e0e0;line-height: 320%;text-align: left;}
</style>
